<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="renderer" content="webkit">
    <title>北京市巨山农场农业信息化管理平台</title>
    <meta name="keywomrds" content="北京市巨山农场农业信息化管理平台">
    <meta name="description" content="北京市巨山农场农业信息化管理平台">
    <!--[if lt IE 9]>
    <meta http-equiv="refresh" content="0;ie.html"/>
    <![endif]-->
    <link th:href="@{favicon.ico}" rel="stylesheet"/>
    <link th:href="@{/css/bootstrap.min.css}" rel="stylesheet"/>
    <link th:href="@{/css/jquery.contextMenu.min.css}" rel="stylesheet"/>
    <link th:href="@{/css/font-awesome.min.css}" rel="stylesheet"/>
    <link th:href="@{/css/animate.css}" rel="stylesheet"/>
    <link th:href="@{/css/style.css}" rel="stylesheet"/>
    <link th:href="@{/css/skins.css}" rel="stylesheet"/>
    <link th:href="@{/dist/css/public.css}" rel="stylesheet"/>
    <link th:href="@{/ruoyi/css/ry-ui.css?v=3.2.0}" rel="stylesheet"/>
    <link rel="stylesheet" th:href="@{/msg-layer/naranja.min.css}">


    <style type="text/css">
        .nav > li:hover .dropdown-menu {
            display: block;
        }

        .mainContent {
            overflow: hidden;
            width: 100%;
            height: 100%;
        }

        .navbar-header {
            height: 60px;
            width: 60px;
        }

        .navbar-header a {
            display: inline-block;
            height: 60px;
            width: 60px;
            padding: 0px;
            margin: 0px;
            text-align: center;
            line-height: 60px;
        }

        .row {
            margin-right: 0px;
            margin-left: 0px;
        }

        .content-tabs {
            margin-right: -15px;
            margin-left: -15px;
        }

        /*标题以下高度 61*/
        #wrapper {
            height: calc(100% - 150px) !important;
        }

        /*iframe 高度 内容 76*/
        #content-main {
            height: calc(100% - 64px) !important;
        }

        /*首页高度 36*/
        #homePage {
            margin-left: 0px;
            height: calc(100% - 36px);
        }

        #content-main.max {
            height: calc(100% + 19px) !important;
        }

        .top-menu {
            padding: 0px;
        }

        nav.page-tabs {
            margin-left: 0px;
            height: 34px;
            line-height: 34px;
        }

        .content-tabs {
            /*line-height: 38px;*/
            line-height: 34px;
            height: 34px;
            background: transparent;

        }

        .skin-blue .content-tabs {
            border-bottom: none;
        }

        .page-tabs a.active {
            background: transparent;
            color: #666;
        }

        .page-tabs a {
            border-right: none;
            color: #666;
            margin-left: 12px;
            line-height: 30px;
            margin-top: 2px;
            display: inline-block;
        }

        ::-webkit-scrollbar-thumb {
            background-color: #0086f2;
        }

        nav.page-tabs {
            width: 100%;
        }

        .back:hover {
            color: #666 !important;
            border-right: 1px;
        }

        /*角标 */

        .ii {
            /*display: none;*/
            background: #f00;
            border-radius: 50%;
            width: 20px;
            height: 20px;
            top: 5px;
            right: 0px;
            position: absolute;
            text-align: center;
            color: #FFF;
            z-index: 99999;
        }

    </style>
</head>
<body class="fixed-sidebar full-height-layout gray-bg"
      th:classappend="${@config.getKey('sys.index.skinName')}">

<div class="container" hidden="hidden">
    <div class="row" style="padding:2em 0">
        <div class="col-md-2">
            <button class="btn btn-error" onclick="narn(&#39;log&#39;)">默认（log）</button>
        </div>
        <div class="col-md-2">
            <button class="btn btn-success" onclick="narn(&#39;success&#39;)">成功（success）</button>
        </div>
        <div class="col-md-2">
            <button class="btn btn-warning" onclick="narn(&#39;warn&#39;)">警告（warn）</button>
        </div>
        <div class="col-md-2">
            <button class="btn btn-danger" onclick="narn(&#39;error&#39;)">危险（error）</button>
        </div>
    </div>
</div>
<!--头部开始-->
<!--<div th:style="'background:url(' + @{/img/h_bg.png} + ') center top no-repeat;background-size:100% 100%;height: 85px'"></div>-->
<div>
    <div class="top-logo">
        <div class="logo-img">
            <img th:src="@{/img/topHeader-logo.png}" alt="">
        </div>
    </div>
</div>
<div class="gray-bg dashbard-1 header-div">
    <div class="row border-bottom" style="margin-left: 0px">
        <nav class="navbar navbar-static-top top-menu" role="navigation" style="margin-bottom: 0">
            <!--<div class="navbar-header">
                <a class="navbar-minimalize minimalize-styl-2" style="color:#FFF;" href="#" title="收起菜单">
                    <i class="fa fa-bars"></i>
                </a>
            </div>-->
            <div class="navbar-left-outer" style="float:left;">
                <div class="navbar-left-main">
                    <ul class="nav navbar-top-links navbar-left">
                        <li class="active top_nav" style="float: left">
                            <a href="#" id="_0">
                                <i class="fa fa-home"></i>
                                <span class="nav-label">首页</span>
                            </a>
                        </li>
                        <li th:each="menu : ${menus}" style="float: left" class="top_nav">
                            <a class="_blank" th:href="${menu.url}" target="_blank" th:if="${menu.target == 'menuBlank'}" th:attr="link = *{menu.url}" th:id="${menu.menuId}">
                                <i class="fa fa fa-bar-chart-o" th:class="${menu.icon}"></i>
                                <span class="nav-label">[[${menu.menuName}]]</span>
                            </a>

                            <a href="#" th:if="${menu.target != 'menuBlank'}" th:attr="link = *{menu.url}" th:id="${menu.menuId}" th:class="@{${menu.url != '' && menu.url != '#'} ? ${menu.target}}">
                                <i class="fa fa fa-bar-chart-o" th:class="${menu.icon}"></i>
                                <span class="nav-label">[[${menu.menuName}]]</span>
                            </a>
                        </li>
                    </ul>
                </div>
            </div>
            <ul class="nav navbar-top-links navbar-right welcome-message">
                <li><a title="全屏显示" id="fullScreen"><i class="fa fa-arrows-alt"></i> 全屏显示</a></li>
                <li><a id="msg" onclick="tomsg()"><span id="msgNum" class="ii"></span> <i class="fa fa-commenting"></i></a>
                </li>
                <li class="dropdown user-menu">
                    <a href="javascript:" class="dropdown-toggle" data-toggle="dropdown" data-hover="dropdown">
                        <img th:src="(${user.avatar} == '') ? @{/img/profile.jpg} : @{/profile/avatar/} + ${user.avatar}"
                             class="user-image">
                        <span class="hidden-xs">[[${user.dept.deptName}]] [[${user.userName}]]</span>
                    </a>
                    <ul class="dropdown-menu">
                        <li class="mt5">
                            <a onclick="myProfile()" class="menuItem">
                                <i class="fa fa-user"></i> 个人中心</a>
                        </li>
                        <li>
                            <a onclick="resetPwd()" class="menuItem">
                                <i class="fa fa-key"></i> 修改密码</a>
                        </li>
                        <li class="divider"></li>
                        <li>
                            <a th:href="@{logout}">
                                <i class="fa fa-sign-out"></i> 退出登录</a>
                        </li>
                    </ul>
                </li>
            </ul>
        </nav>
    </div>
</div>
<div id="wrapper">
    <!--左侧导航开始-->
    <nav class="navbar-default navbar-static-side body-div sideMenu"
         style="left: 0px;position: relative;float: left;display: none" role="navigation">
        <div class="nav-close">
            <i class="fa fa-times-circle"></i>
        </div>
        <div class="sidebar-collapse">
            <ul class="nav" id="side-menu">
                <li class="active li_0">
                    <ul class="nav collapse">
                        <li class="active" name="left-menu">
                            <a class="menuItem" th:href="@{/system/main}">

                                <i class=" fa fa-address-card-o"></i>
                                <span class="nav-label">了解若依</span>
                            </a>
                        </li>

                    </ul>
                </li>
                <li th:each="menu : ${menus}">
                    <!--<a href="#" style="display:none;">
                        <i class="fa fa fa-bar-chart-o" th:class="${menu.icon}"></i>
                        <a class="nav-label" th:text="${menu.menuName}">一级菜单</a>
                        <span class="fa arrow"></span>
                    </a>-->
                    <ul class="nav collapse" style="display: block">
                        <li th:each="cmenu : ${menu.children}" th:class="${menu.menuId} " name="left-menu"
                            style="display:none;">

                            <a th:if="${#lists.isEmpty(cmenu.children)}"  class="menuItem"
                               th:href="@{${cmenu.url}}">
                                <i class="fa fa fa-bar-chart-o" th:class="${cmenu.icon}"></i>
                                <span class="nav-label">[[${cmenu.menuName}]]</span>
                            </a>

                            <a class="sencond-parent" th:if="${not #lists.isEmpty(cmenu.children)}" href="#">
                                <i class="fa fa fa-bar-chart-o " th:class="${cmenu.icon}"></i>
                                <span class="nav-label">[[${cmenu.menuName}]]</span><span class="fa arrow"></span>

                            </a>

                            <ul th:if="${not #lists.isEmpty(cmenu.children)}" class="nav nav-second-level">
                                <li th:each="emenu : ${cmenu.children}">
                                    <a th:if="${emenu.target == 'menuBlank'}" target="_blank" th:text="${emenu.menuName}" th:href="@{${emenu.url}}">三级菜单</a>
                                    <a th:if="${emenu.target != 'menuBlank'}" class="menuItem" th:text="${emenu.menuName}" th:href="@{${emenu.url}}">三级菜单</a>
                                </li>
                            </ul>
                        </li>
                    </ul>
                </li>


            </ul>
        </div>
    </nav>
    <!--左侧导航结束-->
    <!--右侧部分开始-->
    <div id="page-wrapper" class="gray-bg dashbard-1 body-div" style="display: none">
        <div class="row content-tabs">
            <!--<button class="roll-nav roll-left tabLeft">
                <i class="fa fa-backward"></i>
            </button>-->
            <nav class="page-tabs menuTabs">
                <div class="page-tabs-content">
                    <a href="javascript:;" class="active menuTab" data-id="/system/main">首页</a>

                </div>
                <div class="page-tabs-content" style="float: right">
                    <a href="javascript:window.history.back();" class="btn btn-sm btn-success back"
                       style="float:right;margin-right: 32px;display: none;color: white">返回</a>
                </div>
            </nav>
            <!--<button class="roll-nav roll-right tabRight">
                <i class="fa fa-forward"></i>
            </button>-->

            <!--<a href="#" class="roll-nav roll-right tabReload"><i class="fa fa-refresh"></i> 刷新</a>-->
        </div>

        <a id="ax_close_max" class="ax_close_max" href="#" title="关闭全屏"> <i class="fa fa-times-circle-o"></i> </a>

        <div class="row mainContent" id="content-main">
            <iframe class="RuoYi_iframe" name="iframe0" width="100%" height="100%" data-id="/system/main"
                    th:src="@{/system/main}" frameborder="0" seamless></iframe>

        </div>

        <div class="footer footerSec">
            <div class="footer-main">©Copyright (c) [[${copyrightYear}]] 北京市巨山农场农业信息化管理平台</div>
        </div>

    </div>
    <!--右侧部分结束-->
    <div id="homePage" class="gray-bg dashbard-1 body-div">
        <div class="row mainContent">
            <iframe class="home-iframe" name="iframe0" width="100%" height="100%" data-id="/system/main"
                    th:src="@{/system/main}" frameborder="0" seamless></iframe>
        </div>
        <div class="footer">
            <div class="footer-main">©Copyright (c) [[${copyrightYear}]] 北京市巨山农场农业信息化管理平台</div>
        </div>
    </div>
</div>


<!-- 全局js -->
<script th:src="@{/js/jquery.min.js}"></script>
<script th:src="@{/js/bootstrap.min.js}"></script>
<script th:src="@{/js/plugins/metisMenu/jquery.metisMenu.js}"></script>
<script th:src="@{/js/plugins/slimscroll/jquery.slimscroll.min.js}"></script>
<script th:src="@{/js/jquery.contextMenu.min.js}"></script>
<script th:src="@{/ajax/libs/blockUI/jquery.blockUI.js}"></script>
<script th:src="@{/ajax/libs/layer/layer.min.js}"></script>
<!--<script src="http://tajs.qq.com/stats?sId=62048022"></script>-->
<script th:src="@{/ruoyi/js/ry-ui.js?v=3.4.0}"></script>
<script th:src="@{/ruoyi/index.js}"></script>
<script th:src="@{/ajax/libs/fullscreen/jquery.fullscreen.js}"></script>
<script th:src="@{/webjars/sockjs-client/1.0.2/sockjs.min.js}"></script>
<script th:src="@{/webjars/stomp-websocket/2.3.3/stomp.min.js}"></script>
<script th:src="@{/msg-layer/naranja.js}"></script>


<!-- 全局js -->
<script th:inline="javascript">
    var isClicked = false;
    var ctx = [[@{
        /}]];

        /*用户管理-重置密码*/
        function resetPwd() {
            var url = ctx + 'system/user/profile/resetPwd';
            $.modal.open("重置密码", url);
        }

        /*用户管理-重置密码*/
        function myProfile() {
            var url = ctx + 'system/user/profile';
            $.modal.open("个人中心", url, 1000);
        }

        /*消息角标*/
        $(function () {

            $.ajax({
                type: "GET",
                url: ctx + 'system/getMsgCount',
                dataType: "json",
                success: function (data) {
                    if (data == 0) {
                        $("#msgNum").hide();
                    }
                    $("#msgNum").text(data)
                }

            })
        })


        $('.li_0').show();
        $('.top_nav').find('a:not(._blank)').click(function () {
            $('.top_nav').closest('li').removeClass('active');
            $(this).closest('li').addClass("active");
            var id = $(this).attr('id');

            var link = $(this).attr('link')
            if ("_0" == id || "msg" == id) {
                $('#homePage').show();
                $('#page-wrapper').hide();

                $('.navbar-static-side').hide();
            } else if (link != '#') {
                $('#homePage').show();
                $('#page-wrapper').hide();

                $('.navbar-static-side').hide();



                $('.home-iframe').attr('src', link);
            } else {

                $('#homePage').hide();
                $('#page-wrapper').show();
                $('.navbar-static-side').show();
            }


            $('li[name=left-menu]').hide()
            $('.' + id).show();

            isClicked = false;
            clickFirst($('.' + id))

        });

        function clickFirst(lis) {
            for (var i = 0; i < lis.length; i++) {
                var li = lis[i];
                var a = $(li).find('a')[0];
                if (!$(li).hasClass('active') && i == 0 && $(a).attr('href') == '#') {
                    a.click();
                }
                if (a && $(a).attr('href') != '#' && !isClicked) {
                    isClicked = true;
                    a.click()
                    return;
                } else if ($(li).find('ul li') && $(li).find('ul li').length > 0) {
                    clickFirst($(li).find('ul li'))
                }
            }

        }

        $('.sencond-parent').click(function () {
            $(this).parent().find('ul a')[0].click();
        });

        function tomsg() {
            $('#homePage').show();

            $('.home-iframe').show().attr('src', ctx + "system/notice2")
            $('#page-wrapper').hide();

            $('.navbar-static-side').hide();

            $("#msgNum").hide();
        }

        $("#_0").click(function () {
            $('.home-iframe').show().attr('src', ctx + 'system/main')

            $('#homePage').show();
            $('#page-wrapper').hide();

            $('.navbar-static-side').hide();

        })


</script>
<script th:inline="javascript">

    var stompClient = null;

    var userId = [[${user.userId}]]

    //连接到socket服务器
    function connect() {
        var socket = new SockJS('/gs-guide-websocket');
        stompClient = Stomp.over(socket);
        stompClient.connect({}, function (frame) {
            console.log('Connected: ' + frame);
            //接收服务端发送给/topic/greetings的订阅信息
            stompClient.subscribe('/topic/imsg', function (msg) {
                addmsg(msg);
            });
        });

        //断开连接
        function disconnect() {
            if (stompClient !== null) {
                stompClient.disconnect();
            }

            //向服务器发送信息
            function sendHello() {
                stompClient.send("/app/sendimsg", {}, "hello server");
            }

        }

    }

    function addmsg(msg) {


        var m = JSON.parse(msg.body);

        var u1 = "," + userId + ",";

        var us = "," + m.userId + ",";
        if (m.noticeId && m.deptId == 1) {
            newmsg(m);
        } else if (us.indexOf(u1) >= 0) {
            newmsg(m)
        }

    }

    function newmsg(m) {
        narn("success", m);
    }


    $('.send').click(function () {
        var word = $('.input').val();
        stompClient.send("/app/sendimsg", {}, word);
    });


    function narn(type, m) {
        naranja()[type]({
            title: m.noticeTitle,
            text: m.noticeContent,
            timeout: 'keep'
        })
    }

    connect();
</script>
<script>
    // 顶部导航
    var _navHeaderWidth = $('.top-menu').width() - $('.navbar-header').width() - $('.navbar-right').width();
    $('.navbar-left-outer').width(_navHeaderWidth);

    setnavbarLeft();

    function setnavbarLeft() {
        var _navbarLeftWidth = 20
        $('.navbar-left li').each(function () {
            _navbarLeftWidth += $(this).width()
        });
        if (_navHeaderWidth < _navbarLeftWidth) {
            $('.navbar-left').width(_navbarLeftWidth);
        } else {
            $('.navbar-left').width(_navHeaderWidth);
        }
    }

    $('.navbar-header').click(function () {

    })

    $(window).resize(function () {
        _navHeaderWidth = $('.top-menu').width() - $('.navbar-header').width() - $('.navbar-right').width();
        $('.navbar-left-outer').width(_navHeaderWidth);
        setnavbarLeft();
    });

    function open(url) {
        $.modal.open(url);
    }

</script>

</body>
</html>
